import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import QtQuick.Controls.Material

RowLayout {
    id: root
    property alias currentValue: searchType.currentValue
    signal searchRequested

    // 搜索类型选择
    ComboBox {
        id: searchType
        model: [
            { text: "按学号", value: "id" },
            { text: "按姓名", value: "name" },
            { text: "按学院", value: "college" },
            { text: "按班级", value: "className" }
        ]
        textRole: "text"
        Layout.preferredWidth: 180
        Layout.preferredHeight: 48

        background: Rectangle {
            color: "#2a2a4a"
            radius: 8
            border.color: parent.activeFocus ? "#6a5acd" : "#4a4a7a"
        }

        contentItem: Text {
            text: parent.displayText
            color: "#e0e0ff"
            leftPadding: 16
            verticalAlignment: Text.AlignVCenter
        }

        popup: Popup {
            y: parent.height
            width: parent.width
            implicitHeight: contentItem.implicitHeight

            background: Rectangle {
                color: "#2a2a4a"
                radius: 8
                border.color: "#4a4a7a"
            }

            contentItem: ListView {
                clip: true
                implicitHeight: contentHeight
                model: searchType.popup.visible ? searchType.delegateModel : null

                delegate: ItemDelegate {
                    width: searchType.width
                    height: 40

                    contentItem: Text {
                        text: modelData.text
                        color: "#e0e0ff"
                        leftPadding: 16
                        verticalAlignment: Text.AlignVCenter
                    }

                    background: Rectangle {
                        color: parent.hovered ? "#3a3a5a" : "transparent"
                    }
                }
            }
        }
    }

    // 搜索输入框
    TextField {
        id: searchField
        placeholderText: "输入搜索关键词..."
        placeholderTextColor: "#8080a0"
        Layout.fillWidth: true
        Layout.preferredHeight: 48
        color: "#e0e0ff"

        background: Rectangle {
            color: "#2a2a4a"
            radius: 8
            border.color: parent.activeFocus ? "#6a5acd" : "#4a4a7a"
        }

        // 清空按钮
        ToolButton {
            visible: searchField.text !== ""
            anchors.right: parent.right
            anchors.verticalCenter: parent.verticalCenter
            anchors.rightMargin: 10
            contentItem: Text {
                text: "×"
                color: "#a0a0c0"
                font.pixelSize: 20
            }
            onClicked: searchField.clear()
        }
    }

    // 搜索按钮
    Button {
        text: "搜索"
        Layout.preferredWidth: 120
        Layout.preferredHeight: 48
        Material.background: "#6a5acd"
        Material.foreground: "white"

        contentItem: RowLayout {
            spacing: 8
            anchors.centerIn: parent

            Text {
                text: "🔍"
                font.pixelSize: 16
            }

            Text {
                text: parent.parent.text
                font.bold: true
                color: "white"
            }
        }

        background: Rectangle {
            radius: 8
            color: parent.hovered ? Qt.darker("#6a5acd", 1.2) : "#6a5acd"

            // 按钮发光效果
            Rectangle {
                anchors.fill: parent
                radius: parent.radius
                color: "transparent"
                border.color: "#a090ff"
                border.width: 1
                opacity: 0.5
                visible: parent.parent.hovered
            }
        }

        onClicked: root.searchRequested()
    }
}
